<%@ page language="java" pageEncoding="UTF-8" contentType="text/html;charset=UTF-8"%>
<%@ include file="/common/header.jsp" %>
<div class="row">
	<div class="col-xs-12">	
		<form id="demoForm" name="demoForm" class="form-horizontal" role="form">
					<div class="form-group">	
					<label class="col-sm-3 control-label no-padding-right" for="demoid1">demoid</label>
					<div class="col-sm-9">
						<div class="clearfix">
								<input type="text" id="demoid1" name="demoid" class="col-xs-10 input-pk" value="${demo.demoid}"/>	
					    </div>
					</div>
				</div>
					<div class="form-group">	
					<label class="col-sm-3 control-label no-padding-right" for="demoname1">DEMONAME</label>
					<div class="col-sm-9">
						<div class="clearfix">
								<input type="text" id="demoname1" name="demoname" class="col-xs-10  can-modify" value="${demo.demoname}"/>
					    </div>
					</div>
				</div>
				
																			<div class="form-group">	
					<label class="col-sm-3 control-label no-padding-right" for="demourl1">demourl</label>
					<div class="col-sm-9">
						<div class="clearfix">
								<input type="text" id="demourl1" name="demourl" class="col-xs-10  can-modify" value="${demo.demourl}"/>	
					    </div>
					</div>
				</div>
					<div class="form-group">	
					<label class="col-sm-3 control-label no-padding-right" for="demoorg1">demoorg</label>
					<div class="col-sm-9">
						<div class="clearfix">
									<input type="text" id="demoorg1" name="demoorg" class="col-xs-10 can-modify" value="${demo.demoorg}" readonly="readonly"/>

					    </div>
					</div>
				</div>
					<div class="form-group">	
					<label class="col-sm-3 control-label no-padding-right" for="demodept1">demodept</label>
					<div class="col-sm-9">
						<div class="clearfix">
									<input type="text" id="demodept1" name="demodept" class="col-xs-10 can-modify" value="${demo.demodept}" readonly="readonly"/>

					    </div>
					</div>
				</div>
					<div class="form-group">	
					<label class="col-sm-3 control-label no-padding-right" for="demouser1">demouser</label>
					<div class="col-sm-9">
						<div class="clearfix">
									<input type="text" id="demouser1" name="demouser" class="col-xs-10 can-modify" value="${demo.demouser}" readonly="readonly"/>

					    </div>
					</div>
				</div>
					<div class="form-group">	
					<label class="col-sm-3 control-label no-padding-right" for="demostatus1">demostatus</label>
					<div class="col-sm-9">
						<div class="clearfix">
								  <select class="col-xs-10 col-sm-8 can-modify" id="demostatus1" name="demostatus">
								  	<hw:dictName dictType='D00026' dictCode='${demo.demostatus}'/>
								  </select>
					    </div>
					</div>
				</div>
					<div class="form-group input-img">
					<label class="col-sm-3 control-label no-padding-right" for="demopic1">demopic</label>
					<div class="col-sm-9">
						<div class="clearfix">
						<c:choose>  
  
                            <c:when test="flag == 'add'">  
                            <img width="150" height="150" alt="150x150" src="${rc.contextPath}/images/nopic.jpg" class="can-modify"/> 
                            </c:when>  
                            <c:otherwise>
                            <img width="150" height="150" alt="150x150" src="${rc.contextPath}/${demo.demopic}" class="can-modify"/>
                            </c:otherwise>  
                        </c:choose> 
							<%-- <c:if test="flag == 'add'">
							<img width="150" height="150" alt="150x150" src="${rc.contextPath}/images/nopic.jpg" class="can-modify"/>
							<c:else>
							<img width="150" height="150" alt="150x150" src="${rc.contextPath}/${demo.demopic}" class="can-modify"/>
							</c:if> --%>
					    </div>
					</div>
				</div>
					<div class="form-group">	
					<label class="col-sm-3 control-label no-padding-right" for="demofile1">demofile</label>
					<div class="col-sm-9">
						<div class="clearfix">
							<input type="file" id="demofile1" name="demofile" class="can-modify"/>
					    </div>
					</div>
				</div>
					<div class="form-group">	
					<label class="col-sm-3 control-label no-padding-right" for="demodate1">demodate</label>
					<div class="col-sm-9">
						<div class="clearfix">
							<input type="text" id="demodate1" name="demodate" class="col-xs-10 can-modify" readonly="readonly" value="${demo.demodate}"/>
							<span class="input-group-addon">
								<i class="fa fa-calendar bigger-150"></i>
							</span>
					    </div>
					</div>
				</div>
					<div class="form-group">	
					<label class="col-sm-3 control-label no-padding-right" for="remark1">remark</label>
					<div class="col-sm-9">
						<div class="clearfix">
							<textarea class="form-control can-modify" id="remark1" maxlength="" placeholder="">${demo.remark}</textarea>
					    </div>
					</div>
				</div>
		</form>
	</div>		
</div>
<script type="text/javascript">
$(function(){
	initButtons();
	if ("${flag!}" != "add") {
		disabledAll();			
	} 
	
		$("#demoorg1").orgTreeSelect({
			checkType:"org", 
			defaultOrgId:"${sessionOrg}",
			defaultOrgName:'<hw:orgName orgId="${sessionOrg}" />',
			queryRootOrgId:"${sessionOrg}"
		});
		$("#demodept1").orgTreeSelect({
			checkType:"org", 
			defaultOrgId:"${sessionOrg}",
			defaultOrgName:'<hw:orgName orgId="${sessionOrg}" />',
			queryRootOrgId:"${sessionOrg}"
		});
		 $("#demouser1").userinput({
		 	belongAreaId:'',
		 	belongDeptId: 'applyDept',
		 	defaultUserName:'<hw:userName userId='${sessionUserId}'/>',
		    defaultUserCode:"${sessionUserName}"
		 });
		$('#demofile1').ace_file_input({
			no_file:'æ²¡ææä»¶ ...',
			btn_choose:'éæ©',
			btn_change:'ä¿®æ¹',
			droppable:false,
			onchange:null,
			thumbnail:false //| true | large
			//whitelist:'gif|png|jpg|jpeg'
			//blacklist:'exe|php'
			//onchange:''
			//
		});
		$("#demodate1").datepicker({
			showOtherMonths: true,
			selectOtherMonths: true,
			dateFormat:'yy-mm-dd'
		});
	
	
	$('#demoForm').validate({
		errorElement: 'div',
		errorClass: 'help-block',
		focusInvalid: false,
		ignore: "",
		rules: {
			
			demoid:{
				required:true
			}
						,
			demourl:{
				url:true
			}
			,
			demoorg:{
			}
			,
			demodept:{
			}
			,
			demouser:{
			}
			,
			demostatus:{
			}
			,
			demopic:{
			}
			,
			demofile:{
			}
			,
			demodate:{
			}
			,
			remark:{
			}
		},
	
		messages: {
			
		},
	
		submitHandler: function (form) {
		},
		invalidHandler: function (form) {
		}
	});
	
});


function initButtons() {
	if ("${flag}" == "add") {
		$("#btnPModify").hide();
		$("#btnPSave").show();
		$("#btnPDelete").hide();
		$("#btnPCancle").hide();
		$("#btnPClose").show();		
	} else {
		$("#btnPModify").show();
		$("#btnPSave").hide();
		$("#btnPDelete").show();
		$("#btnPCancle").hide();
		$("#btnPClose").show();	
	}

}


function disabledAll() {
	$("#demoForm input").attr("disabled", true);
	$("#demoForm textarea").attr("disabled", true);
	$("#demoForm select").attr("disabled", true);
}

function enabledAll() {
	$("#demoForm input").attr("disabled", false);
	$("#demoForm textarea").attr("disabled", false);
	$("#demoForm select").attr("disabled", false);
}

function cancle() {
	initButtons();
	disabledAll();
}

function modify() {
	$("#btnPModify").hide();
	$("#btnPSave").show();
	$("#btnPDelete").hide();
	$("#btnPCancle").show();
	$("#btnPClose").show();
		
	$("#demoForm .can-modify").attr("disabled", false);
	$("#demoForm .input-pk").attr("disabled", false).attr("readonly",true);
	
}


function save() {
	if(!$("#demoForm").valid())
		return;
	var url;
	if ("${flag}" == "add") {
		url = "${rc.contextPath}/demo/add.do";
	}else {
		url = "${rc.contextPath}/demo/modify.do";
	}
    		
	$.ajax({
		async : false,
		url: url,
		type:"post",
		data: $("#demoForm").serialize(),
		dataType:"json",
		success: function(ret){	
			if (ret[0] == "ok") {
				alert(ret[1]);
				$("#demoIframe").dialog("close");
				$("#demoIframe").empty();
				$("#searchDemo").click();
			} else {
				alert(ret[1]);
			}				
		},
		error: function(ret){
			alert(ret.responseText);
		}
	}); 
}

</script>